<template>
	<div class="padding-across-10" v-loading.fullscreen.lock="loading" element-loading-text="拼命加载中">
		<div class="flex-inline">
			<headerOpreate style="float: left;width: 180px" :opreate-datas="opreateDatas" v-on:executeAction="executeAction"></headerOpreate>
			<div class="block" style="text-align:right;float: right;padding: 2px 0">
				<el-pagination @current-change="handleCurrentChange" @size-change="handleSizeChange" :current-page="currentPage" :page-size="pageSize" :page-sizes="[10,20,30,40,50]" layout="total,sizes, prev, pager, next, jumper" :total="totalSize">
				</el-pagination>
			</div>
		</div>
		<el-table border style="width: 100%;" :data="tableData" @selection-change="handleSelectionChange">
			<el-table-column :show-overflow-tooltip="true" type="selection" align="center"></el-table-column>
			<el-table-column :show-overflow-tooltip="true" label="书名" align="center" prop="Name"></el-table-column>
			<el-table-column :show-overflow-tooltip="true" label="条码" align="center" prop="BookBarcode"></el-table-column>
			<el-table-column :show-overflow-tooltip="true" label="标签" align="center" prop="RFIDTag"></el-table-column>
			<el-table-column :show-overflow-tooltip="true" label="馆藏地" align="center" prop="Location"></el-table-column>
			<el-table-column :show-overflow-tooltip="true" label="剔旧时间" align="center" prop="Time"></el-table-column>
			<el-table-column :show-overflow-tooltip="true" label="状态" align="center">
				<template slot-scope="scope">
					<el-tag type="danger" v-if="scope.row.Status === 1">丢失</el-tag>
					<el-tag type="warning" v-if="scope.row.Status === 2">外借</el-tag>
					<el-tag type="success" v-if="scope.row.Status === 3">在库</el-tag>
				</template>
			</el-table-column>
			<el-table-column :show-overflow-tooltip="true" v-if="resultShow" label="操作结果" align="center">
				<template slot-scope="scope">
					<el-tag type="success" v-if="scope.row.result === 1">取消成功</el-tag>
					<el-tag type="danger" v-if="scope.row.result === 2">{{scope.row.resultMsg}}</el-tag>
				</template>
			</el-table-column>
		</el-table>
		<div class="block" style="text-align:right;margin-bottom:100px;padding-top: 3px">
			<el-pagination @current-change="handleCurrentChange" @size-change="handleSizeChange" :current-page="currentPage" :page-size="pageSize" :page-sizes="[10,20,30,40,50]" layout="total,sizes, prev, pager, next, jumper" :total="totalSize">
			</el-pagination>
		</div>
	</div>
</template>
<script>
	import $ from 'jquery'
	import { GloabFun, HttpServer } from '../../../../../assets/js/common.js'
	import headerOpreate from '../../../../../components/headerOpreate'
	let id = 1000;
	export default {
		components: {
			headerOpreate
		},
		data() {
			return {
				resultShow: false,
				tableData: [],
				multipleSelection: [],
				currentPage: 1,
				pageSize: 10,
				totalSize: 0,
				loading: false,
				opreateDatas: [{
						size: "small",
						type: 'primary',
						icon: 'el-icon-eleg-icon_refresh el-icon--left',
						name: '刷新',
						action: 'reloadDatas'
					},
					{
						size: "small",
						type: 'danger',
						icon: 'el-icon-eleg-social_picassa el-icon--left',
						name: '取消剔旧',
						action: 'removePickout'
					}
				]
			}
		},
		props: {
			templateObj: {
				type: Object,
				default: function() {
					return {};
				}
			}
		},
		methods: {
			executeAction(action) {
				if(action) {
					this[action]();
				}
			},
			handleCurrentChange(val) {
				this.currentPage = val;
				this.searchBook();
			},
			handleSizeChange(val) {
				this.pageSize = val;
				this.searchBook();
			},
			formateDate(array) {
				for(var i = 0; i < array.length; i++) {
					var index1 = array[i].Time.indexOf("T");
					array[i].Time = array[i].Time.substring(0, index1) + " " + array[i].Time.substring(index1 + 1, index1 + 9);
				}
			},
			//多选
			handleSelectionChange(val) {
				this.multipleSelection = val;
			},
			formateSelection() {
				var result = [],
					array = this.multipleSelection;
				for(var i = 0; i < array.length; i++) {
					result.push(array[i].ID);
				}
				return result;
			},
			//批量取消替旧
			removePickout() {
				let vm = this;
				if(this.formateSelection().length > 0) {
					this.$confirm('此操作将还原所选剔旧书籍，是否继续?', '提示', {
						confirmButtonText: '确定',
						cancelButtonText: '取消',
						type: 'warning'
					}).then(() => {
						HttpServer.httpPost.call(this, '/Api/PickOut/Remove', {
							bookid: this.formateSelection()
						}, function(response) {}, function(response) {
							// console.log('res',response)
							this.resultShow = true;
							response.data.info.forEach(function(res) {
								vm.tableData.forEach(function(item) {
									if(res.bookcode === item.BookBarcode) {
										if(res.code === 0) {
											item.result = 1;
											item.resultMsg = '取消成功';
										} else {
											item.result = 2;
											item.resultMsg = res.msg;
										}
									}
								})
							})
						})
					}).catch(() => {
						this.$notify.info({
							title: '消息',
							message: this.$t('message.operationCanceled'),
							duration: 2500
						})
					});
				} else {
					this.$notify({
						title: this.$t('message.warning'),
						message: '请选择批量操作的项',
						type: 'warning',
						duration: 2500
					});
				}
			},
			//刷新
			reloadDatas() {
				this.resultShow = false;
				this.loading = true;
				HttpServer.httpPost.call(this, '/Api/PickOut/AllInfo', {
					index: this.currentPage,
					pagesiz: this.pageSize
				}, function(response) {}, function(response) {
					this.loading = false;
					// console.log('已剔旧图书信息',response)
					if(response.data.code === 0) {
						this.formateDate(response.data.info);
						response.data.info.forEach(function(item) {
							item.result = 0;
							item.resultMsg = '';
						})
						this.tableData = response.data.info;
						this.totalSize = response.data.total;
						this.$notify({
							title: '成功',
							message: this.$t('message.refreshSuccess'),
							type: 'success',
							duration: 2500
						});
					} else {
						this.$notify.error({
							title: '错误',
							message: response.data.msg,
							duration: 2500
						});
					}
				});
			},
			//查询
			getDatas() {
				this.loading = true;
				HttpServer.httpPost.call(this, '/Api/PickOut/AllInfo', {
					index: this.currentPage,
					pagesiz: this.pageSize
				}, function(response) {}, function(response) {
					this.loading = false;
					// console.log('已剔旧图书信息',response)
					if(response.data.code === 0) {
						this.formateDate(response.data.info);
						response.data.info.forEach(function(item) {
							item.result = 0;
							item.resultMsg = '';
						})
						this.tableData = response.data.info;
						this.totalSize = response.data.total;
					} else {
						this.$notify.error({
							title: '错误',
							message: response.data.msg,
							duration: 2500
						});
					}
				});
			},
		},
		created() {
			this.getDatas();
		}
	}
</script>
<style scoped lang="less">
	.flex-inline {
		display: flex;
		justify-content: space-between;
	}
	
	.query {
		display: flex;
		float: left;
	}
	
	.name {
		color: #20a0ff;
	}
	
	.edit-mission {
		padding-top: 50px;
		.el-dialog__header {
			background-color: #000;
		}
		.el-dialog__body {
			position: relative;
		}
		.clearfloat {
			height: 100px;
			max-height: 150px;
		}
	}
</style>